<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="" />
    <meta name="author" content="" />
    <title>Dashboard Template for Bootstrap</title>
    <!-- Bootstrap core CSS -->
    <link href="style/bootstrap.min.css" rel="stylesheet" />
    <!-- Custom styles for this template -->
    <link href="style/dashboard.css" rel="stylesheet" />
  </head>

  <body>
    <div id="app">
      <!-- 3.调用组件 -->
      <app></app>
    </div>
  </body>
  <script src="../../node_modules/vue/dist/vue.js"></script>
  <script src="./components/head.js"></script>
  <script src="./components/nav.js"></script>
  <script src="./components/hobby.js"></script>
  <script src="./components/salary.js"></script>
  <script src="./components/content.js"></script>
  <script src="./components/main.js"></script>
  <!-- 1.引入组件 -->
  <script src="./components/app.js"></script>
  <script>
    new Vue({
      el: "#app",

      //注册组件
      components: {
        app, //2.注册组件
      },
    });
  </script>
</html>
